import { computed, defineComponent, ref } from "vue";
import { Deduplication } from "./Deduplication";
import DynamicStyle from "./DynamicStyle";

import { states } from "./states";
import { usemarkdownurl } from "./usemarkdownurl";

// function onclick(e: MouseEvent) {
//     const ele = e.target;
//     if (!ele) {
//         return;
//     }
//     //@ts-ignore
//     requestIdleCallback(() => {
//         requestAnimationFrame(() => {
//             if (ele instanceof Element) {
//                 scrolltoelement(ele);
//             }
//         });
//     });
// }
const { cachemain, pageerrors } = states;
export default defineComponent({
    components: { DynamicStyle },
    setup() {
        const mdurl = usemarkdownurl();
        const globalstylesheet = computed(getstylesheettext);
        // console.log(getstylesheettext)
        // console.log(globalstylesheet);
        const container = ref<HTMLElement>();

        const html = computed(() => {
            return cachemain.get(mdurl.value);
        });
        const error = computed(() => {
            return pageerrors.get(mdurl.value);
        });

        const allret = {
            globalstylesheet,

            container,
            html,
            mdurl,
            error,
        };
        return allret;
    },

    // watch: {
    //     async html(value) {
    //         if (!value) {
    //             return;
    //         }
    //         await Vue.nextTick();
    //         requestAnimationFrame(() => {
    //             if (!this.container) {
    //                 return;
    //             }
    //             const eles = Array.from(
    //                 this.container.getElementsByClassName("scrollIntoView")
    //             ) as HTMLElement[];

    //             eles.forEach((e: HTMLElement) => {
    //                 e.onclick = onclick;
    //             });
    //         });
    //     },
    // },
});
function getstylesheettext() {
    let text = Deduplication(
        Array.from(states.cachestylecssrules.values())
            .map((a) => Array.from(a))
            .flat()
    ).join("");
    // console.log(text);
    return text;
}
